<template>
  <el-dialog :title="title" :visible.sync="visible" :width="width" :close-on-click-modal='false' class="bonus" @close="handleCancel(false)">
    <el-row>
      <el-form class="col-12" :disabled="!isEdit" :model="formData" ref="formRef" :label-width="labelWidth"  :rules="rules" v-loading="formLoading" :close-on-click-modal="false">
        <el-form-item label="机构名称" prop="deptName">
          <el-input v-model="formData.deptName" autocomplete="off" placeholder="请输入机构名称" clearable disabled></el-input>
        </el-form-item>
        <el-form-item label="机构编号" prop="deptCode">
          <el-input v-model="formData.deptCode" autocomplete="off" placeholder="请输入机构编号" clearable disabled></el-input>
        </el-form-item>
        <el-form-item label="奖金项" prop="bonusItemName">
          <div class="flex">
            <el-input v-model="formData.bonusItemName" autocomplete="off" placeholder="请选择奖金项" clearable ></el-input>
            <el-button type="primary" plain @click="showDialog">选择</el-button>
          </div>
        </el-form-item>
        <el-form-item label="奖金项编码（内）" prop="bonusItemCode">
          <el-input v-model="formData.bonusItemCode" autocomplete="off" placeholder="请输入奖金项编码" clearable disabled></el-input>
        </el-form-item>
        <el-form-item label="奖惩类别" prop="event">
          <el-select
            v-model="formData.event"
            placeholder="请选择"
            class="w100"
            :clearable="true"
            @change="changeEvent">
            <el-option
              v-for="(item, index) in eventOptions"
              :key="index"
              :label="item.name"
              :value="item.name"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="依据" prop="yj" >
          <el-select
            v-model="formData.yj"
            placeholder="请选择依据"
            class="w100"
            @change="changeYj">
            <el-option
              v-for="item in yjOptions"
              :key="item.id"
              :label="item.yj"
              :value="item.yj"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="加扣标准" prop="bz" >
          <el-input v-model="formData.jkfbz" autocomplete="off" placeholder="请输入标准" clearable disabled></el-input>
        </el-form-item>
        <el-form-item label="指标规则" prop="zbgz" >
          <el-radio-group v-model="formData.zbgz" disabled>
            <el-radio :label="`0`">正指标</el-radio>
            <el-radio :label="`1`">负指标</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="奖惩时间" prop="actDate" >
          <el-date-picker type="date" placeholder="选择奖惩时间" v-model="formData.actDate" format="yyyy-MM-dd"  value-format="yyyy-MM-dd" style="width: 100%;" clearable></el-date-picker>
        </el-form-item>
        <el-form-item label="奖惩金额" prop="amount" >
          <el-input-number class="w100 text-left" :controls="false" v-model="formData.amount" autocomplete="off" placeholder="请输入奖惩金额" clearable ></el-input-number>
        </el-form-item>
        <el-row class="w100">
          <el-form-item label="奖惩事由" prop="reason" class="w100">
            <el-input type="textarea" v-model="formData.reason"  :rows="3" autocomplete="off" placeholder="请输入奖惩事由" clearable ></el-input>
          </el-form-item>
        </el-row>
        <el-row style="width: 100%">
          <el-form-item label="附件上传" prop="" style="width: 100%">

          </el-form-item>
        </el-row>
      </el-form>
    </el-row>
    <div slot="footer" class="dialog-footer">
      <el-button @click="handleCancel">取消</el-button>
      <el-button type="primary"  @click="handleSubmit" v-if="type!='view'">确定</el-button>
    </div>

    <!--选择奖金项-->
    <bonus-item ref="bonusItemRef" @sendBonusItem="getBonusItem"></bonus-item>

  </el-dialog>
</template>

<script>
import {addObj,putObj,getJjxSelect}  from '@/api/bonus/dataorgrewardpunish' ;
import selectTree from '@/views/bonusmanage/components/selectTree'
import bonusItem from "@/views/bonusmanage/components/bonusItem";
import {getById, getLbSelect} from "@/api/dailyExamine/eventExamine/event";
export default {
  name: "orgForm",
  components:{
    selectTree,
    bonusItem
  },
  props:{

  },
  watch: {

  },
  data(){
    return{
      type:'add',
      isEdit:true,
      formLoading:false,
      title:'新增',
      width:'50%',
      visible: false,
      labelWidth:'155px',
      formData: {deptCode:'', deptName:'', deptRatio:'',bonusDeptId:''},
      rules: {
        bonusItemName: [{ required: true, message: '请选择奖金项明细', trigger: 'change' }],
        bonusItemCode: [{ required: true, message: '请输入奖金项编码', trigger: 'blur' }],
        event: [{ required: true, message: '请选择奖惩事项', trigger: 'change' }],
        yj:[{ required: true, message: '请选择依据', trigger: 'change' }],
        actDate: [{ required: true, message: '请选择奖惩时间', trigger: 'change' }],
        amount: [{validator:this.$validateUtil.amount,context:this,label:'奖惩金额',required:true}],//验证引入通用的方法
        reason: [{ required: true, message: '请输入奖惩事由', trigger: 'blur' }],
      },
      eventOptions:[],
      yjOptions:[],
      countNum:0,//计算 奖惩类别 点击次数
    }
  },
  methods:{
    init(type,parentData,currentOrg){
      this.type = type
      this.isEdit = this.type == 'view' ? false : true ;
      this.title = this.type == 'view' ? '查看' : this.type == 'add' ? '新增' : '编辑'
      this.currentOrg = currentOrg ; //父组件传过来的选择机构的信息
      this.parentData = parentData ;
      if(type == 'add'){
        this.formData = Object.assign(this.formData,currentOrg)
      }else{
        this.formData = parentData
      }
      this.visible = true ;

      //获取奖惩事项字典
      this.getEventDic() ;
    },
    getEventDic(){
      getLbSelect({yjkfl: 'jg'}).then(r => {
        r.data.data.forEach((ele) => {
          let item = {
            name:ele.fl,
            value:ele.id
          }
          this.eventOptions.push(item);
        });

        //如果是编辑界面，初始化时：根据奖惩类别 获取 依据字典
         if (this.type == 'edit'){
           this.changeEvent(this.formData.event) ;
         }
      });
    },
    changeEvent(val){
      let eventId = ''
      this.eventOptions.map(item=>{
        if (item.name == val){
           eventId = item.value ;
        }
      })

      if (this.type == 'add' || (this.type == 'edit' && this.countNum !== 0)){ //编辑界面进入的第一次执行changeEvent方法，下面的三项不清空
        //规则改变 依据、标准和指标规则清空
        this.$set(this.formData,'yj','')
        this.$set(this.formData,'jkfbz','')
        this.$set(this.formData,'zbgz','')
      }
      this.countNum ++ ;
      getById(eventId).then(r => {
        getLbSelect(Object.assign({
          yjkfl: 'jg',
          fl: r.data.data.fl
        })).then(res => {
            this.yjOptions = res.data.data ;
        });
      });

    },
    changeYj(val){
      this.$forceUpdate() ;

      //依据改变 标准和指标规则清空
      this.$set(this.formData,'jkfbz','')
      this.$set(this.formData,'zbgz','')

      if (!val) return ;
      let currentJy = {} ;
      this.yjOptions.map(item=>{
        if (item.yj == val){
          currentJy = item ;
        }
      })
      this.$set(this.formData,'jkfbz',currentJy.jkfbz) //标准
      this.$set(this.formData,'zbgz',currentJy.zbgz)//指标规则 1负指标
    },
    handleSubmit(){
      this.$refs.formRef.validate((valid) => {
        if (valid) {
          this.formLoading = true ;
          if (this.type == 'add'){
            addObj(Object.assign(this.formData,{bonusDeptId:this.currentOrg.bonusDeptId,deptBaseId:this.currentOrg.id})).then(res=>{
              this.formLoading = false ;
              this.handleCancel(true) ;
            }).catch(()=>{
              this.formLoading = false ;
            })
          }else{
            putObj(this.formData).then(res=>{
              this.formLoading = false ;
              this.handleCancel(true) ;
            }).catch(()=>{
              this.formLoading = false ;
            })
          }

        } else {
          return false;
        }
      });
    },
    handleCancel(refresh){
      this.visible = false ;
      this.formData = {} ;
      this.eventOptions = [] ;
      this.yjOptions = [] ;
      this.countNum = 0 ;
      if (refresh){
        this.$emit('refresh')
      }
      this.$refs.formRef.resetFields() ;
    },
    nodeClick(item){
      this.formData.parentDeptName = item.name
    },
    onChange(){

    },
    showDialog(){
      this.$refs.bonusItemRef.init( this.currentOrg)
    },
    getBonusItem(bonusItem){
      this.$set(this.formData,'bonusItemName',bonusItem.bonusItemName )
      this.$set(this.formData,'itemEccCode',bonusItem.eccCode )
      this.$set(this.formData,'bonusItemCode',bonusItem.bonusItemCode)
    },
  }
}
</script>

<style scoped>

</style>
